.app{
    width: 100%;
    .header{
        line-height: 50px;
        padding-left: 20px;
        background-color: #4294ff;
        a{
            color: #fff;
        }
        .mybadge{
            display: flex;
            height: 135px;
            .mybadge-left{
                padding-top: 30px;
                line-height: 30px;
                flex: 1;
                p{
                    color: #fff;
                    font-size: 24px;
                }
                span{
                    color: #AAD9F7;
                    font-size: 20px;
                }
            }
            .mybadge-right{
                justify-content: space-between;
                position: relative;
                flex: 1;
                display: flex;
                span{
                    font-size: 80px;
                    color: #fff;
                    position: absolute;
                    left: 30%;
                    top: 25%;
                }
                img{
                    align-self:flex-end;
                    width: 100px;
                }
            }
        }
    }
    .medal{
        display: flex;
        padding: 0 15px;
        flex-wrap: wrap;
        justify-content: space-between;
        .badge{
            display: flex;
            margin-top: 25px;
            flex-direction: column;
            align-items: center;
            p{
                font-size: 14px;
            }
        }
    }
}